<template>
    <div class="set_info">
        <div class="title">设置会议信息</div>

        <div class="info">
            <div class="content">
                <span>组织名称：</span>
                <input type="text" v-model="org_name">
            </div>
            <div class="content">
                <span>会议地点：</span>
                <input type="text" v-model="address">
            </div>
            <div class="content">
                <span>主持人：</span>
                <input style="width: 270rpx;" type="text" v-model="host_name">
				<button class="sign" @click="toSign">手写签名</button>
            </div>
			<div style="display: flex;justify-content: flex-end;" v-if="img_url!=''">
				<image style="width: 450rpx;height: 200rpx;background-color: #fff" :src="img_url" mode="aspectFit"></image>
			</div>
            <div class="content">
                <span>记录人：</span>
                <input type="text" v-model="record_name">
            </div>
			<div class="content">
			    <span style='width: 210rpx;margin-right: 0;'>缺席人员名单：</span>
			    <span style='display: flex;width: 58%;'>
					<input style="width:630rpx;margin-left: 0;" type="text" v-model="absence_name">
					<u-icon style='margin-top: -15rpx;margin-left: 5rpx;' name="plus-circle" color='#ffda2f' size='65' @click='tagAdd'></u-icon>
				</span>
			</div>
			<div style='margin: 0 30rpx;display: flex;flex-wrap: wrap;' class='tag'>
				<div v-for="(item,index) in absence_list " :key="index" style='margin-right: 20rpx;margin-bottom: 20rpx;'>
					<u-tag :text="item" mode='plain' closeable  @close="tagClose(index)" border-color='#ffda2f' close-color='#ffda2f' bg-color='#da2424' color='#ffda2f'/>
				</div>
			</div>
            <div class="send" @click="setMeetingActiveInfo">下一步</div>
        </div>

    </div>
</template>

<script>
    export default {
        name: "setInfo",
        data(){
            return{
                key:"",
                org_name:"",
                address:"",
                host_name:"",
                record_name:"",
				absence_name:'',
				absence_list :[],
				img_id:'',
				img_url:''
            }
        },
        onShow(){
            this.key = uni.getStorageSync('key');
            this.getMeetingActiveInfo();
			if(uni.getStorageSync('emcee_base64_img_id') != ""){
			    this.img_id = uni.getStorageSync('emcee_base64_img_id')
			}
			if(uni.getStorageSync('emcee_base64_img_url') != ""){
			    this.img_url = uni.getStorageSync('emcee_base64_img_url')
			}
        },
        methods:{
            async getMeetingActiveInfo(){
                let params = {
                    key:this.key,
                    user_token: uni.getStorageSync('userToken'),
                }
                let res = await this.$api.getMeetingActiveInfo(params);
                if(res.data.level == "success"){
                    let resultData = res.data.data;
                    this.org_name = resultData.org_name;
                    this.address  = resultData.address;
                    this.host_name= resultData.host_name;
                    this.record_name = resultData.record_name;
					if(resultData.absence_list!=null){
						this.absence_list=resultData.absence_list;
					}
					if(uni.getStorageSync('obj') != ""){
						let obj=uni.getStorageSync('obj')
						this.org_name = obj.org_name;
						this.address  = obj.address;
						this.host_name= obj.host_name;
						this.record_name = obj.record_name;
						if(obj.absence_list!=null){
					    	this.absence_list=obj.absence_list;
						}
						
					}
					
                }
            },

            async setMeetingActiveInfo(){
				uni.removeStorageSync('obj')
                let params = {
                    key:this.key,
                    user_token: uni.getStorageSync('userToken'),
                    org_name:this.org_name,
                    address:this.address,
                    host_name:this.host_name,
                    record_name:this.record_name,
					absence_list:this.absence_list,
					hand_sign:this.img_id
                }
                let res = await this.$api.setMeetingActiveInfo(params);
                if(res.data.level == "success"){
                    this.getNowMeetingContent()
                }
            },
            //获取当前会议内容
            async getNowMeetingContent(key='',link_id='',content_id=''){
                let params = {
                    key:uni.getStorageSync('key'),
                }
                let res = await this.$api.getNowMeetingContent(params);
                if(res.data.level == "success"){
                    uni.navigateTo({
                        url:"/pages/host/host"
                    })
                }else{
                    uni.showToast({
                        title: res.data.message,
                        icon: 'none',
                        duration: 1000
                    })
                }
            },
			tagAdd(){
				if(this.absence_name==''){
					uni.showToast({
					    title: '缺席人员名单不能为空',
					    icon: 'none',
					    duration: 1000
					})
					return
				}
				this.absence_list.push(this.absence_name)
				this.absence_name=''
			},
			tagClose(i){
				this.absence_list.splice(i,1)
			},
			toSign(){
				let obj={
					org_name:this.org_name,
					address:this.address,
					host_name:this.host_name,
					record_name:this.record_name,
					absence_list:this.absence_list
				}
				uni.setStorageSync('obj',obj)
			    uni.navigateTo({
			        url:`/pages/sign/sign?type=emcee`
			    })
			}
        }
    }
</script>

<style lang="scss" scoped>
    .set_info {
        width: 100vw;
        min-height: 100vh;
      background-color: #da2424;
        /*background: url("http://file.rzkeji.com/web/dang/wxapp/back.png") no-repeat;*/
        background-size: 100%;
        .title{
            text-align: center;
            width: 100%;
            color: white;
            top: 20px;
            position: fixed;
        }

        .info{
            position: fixed;
            top: 60px;
            padding: 10px;
            width: 100%;

            .content{
                top: 80rpx;
                padding: 20rpx 0;
                width: 100%;
                display: flex;
                align-items: center;
                span{
                    width: 200rpx;
                    color: white;
                }
                margin: 30rpx 0;
                label{
                    color: #ffda2f;
                    margin: 0 30rpx;
                    vertical-align: middle;
                }
                input{
                    width: 60%;
                    border-bottom: 1px solid #ffda2f;
                    color: #ffda2f;
                }
            }

            .send{
                width: 100%;
                height: 80rpx;
                line-height: 80rpx;
                text-align: center;
                color: #FFFFFF;
                background-color: #ffda2f;
                border-radius: 12rpx;
                margin-top: 50rpx;
            }
        }
    }
	.sign{
		font-size: 25rpx;
		width: 200rpx;
		margin-top: -10rpx;
		margin-left: 10rpx;
	}
	/deep/.u-size-default{
		font-size: 40rpx !important;
	}
	/deep/.tag .u-icon__icon{
		font-size: 35rpx !important;
	}
</style>
